<template>
  <div class="create-design">
    <el-page-header @back="goBack" content="添加方案"> </el-page-header>
    <el-form label-width="80px" label-position="left" :model="formData" ref="form" class="form-content">
      <el-form-item label="方案名称" prop="schemeName" size="small" :rules="[
        {
          required: true,
          message: '请输入',
          trigger: 'change',
        },
      ]">
        <el-input size="small" v-model="formData.schemeName" placeholder="请输入方案名称"></el-input>
      </el-form-item>
      <div class="table-item" v-for="(equitItem, idx) in formData.blueForm" :key="idx">
        <div class="table-title">
          <span @click="equitShow(equitItem)">
            <i :class="equitItem.equipShow
              ? 'el-icon-caret-bottom'
              : 'el-icon-caret-top'
              "></i>
            平台{{ idx + 1 }}
          </span>
          <el-form-item style="flex: 1; margin: 0" class="only">
            <el-cascader :show-all-levels="false" v-model="equitItem.platform" :options="blueEquipList"
              :props="{ expandTrigger: 'hover', emitPath: false }" @change="handleChangeBluePlatform"
              disabled></el-cascader>
          </el-form-item>
        </div>
        <transition name="el-zoom-in-top">
          <div class="equit-main" v-show="equitItem.equipShow">
            <div class="equipPerformance">
              <div class="equit-content platformshow-content" v-for="(i, ids) in equitItem.equipPerformance" :key="ids">
                <div class="equit-title">
                  <span @click="equitShows(i)">
                    <i :class="i.platformshow
                      ? 'el-icon-caret-bottom'
                      : 'el-icon-caret-top'
                      "></i>
                    装备{{ ids + 1 }}</span>
                  <el-form-item style="flex: 1; margin: 0" class="only">
                    <el-select v-model="i.equipName" placeholder="请选择"
                      @change="handleChangeBlueEquip($event, equitItem.platform, i)" disabled>
                      <el-option v-for="item in equitItem.blueEquipmentNameList" :key="item.deviceId" :label="item.equipmentName" :value="item.deviceId"
                        :title="item.equipmentName">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </div>
                <transition name="el-zoom-in-top">
                  <div class="equit-main" v-show="i.platformshow">
                    <el-form-item label="能力" :prop="`blueForm[${idx}].equipPerformance[${ids}].capacity`" :rules="[
                      {
                        required: false,
                        message: '请输入',
                        trigger: 'change',
                      },
                    ]">
                      <el-cascader :show-all-levels="false" v-model="i.capacity" :options="capacityList" :props="{
                        expandTrigger: 'hover',
                        emitPath: false,
                      }" @change="handleChange" disabled></el-cascader>
                    </el-form-item>
                    <el-form-item label="性能描述" :prop="`blueForm[${idx}].equipPerformance[${ids}].equipdes`" :rules="[
                      {
                        required: false,
                        message: '请输入',
                        trigger: 'change',
                      },
                    ]">
                      <el-input v-model="i.equipdes" size="small" type="textarea" :rows="5" resize="none" disabled>
                      </el-input>
                    </el-form-item>
                  </div>
                </transition>
              </div>
            </div>
          </div>
        </transition>
      </div>
      <el-button size="small" type="primary" @click="addStep">添加红方</el-button>
      <div v-for="(item, index) in formData.tableList" :key="index">
        <div class="table-item">
          <div class="table-title">
            <span @click="changEquitShow(index, item)">
              <i :class="item.show ? 'el-icon-caret-bottom' : 'el-icon-caret-top'
                "></i>
              红方步骤{{ index + 1 }}</span>
            <el-button type="text" @click="cancelEquitStep(index)">删除</el-button>
          </div>
          <transition name="el-zoom-in-top">
            <div class="table-content" v-show="item.show">
              <el-form-item label="作战活动" :prop="`tableList[${index}].activity`" :rules="[
                {
                  required: true,
                  message: '请输入',
                  trigger: 'change',
                },
              ]">
                <el-select v-model="item.activity" placeholder="请选择" size="small" @change="changeSelect(item)">
                  <el-option v-for="item in activityOptions" :key="item.value" :label="item.label" :value="item.value"
                    :title="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="活动描述" :prop="`tableList[${index}].activityDes`" :rules="[
                {
                  required: true,
                  message: '请输入',
                  trigger: 'change',
                },
              ]">
                <el-input disabled v-model="item.activityDes" placeholder="请输入" size="small" type="textarea" :rows="5"
                  resize="none"></el-input>
              </el-form-item>
              <el-form-item label="步骤描述" :prop="`tableList[${index}].stepDes`" :rules="[
                {
                  required: true,
                  message: '请输入',
                  trigger: 'change',
                },
              ]">
                <el-input placeholder="请输入" v-model="item.stepDes" size="small" type="textarea" :rows="5"
                  resize="none"></el-input>
              </el-form-item>
              <div class="equit-content" v-for="(equitItem, idx) in item.equip" :key="idx">
                <div class="equit-title">
                  <span @click="equitShow(equitItem)">
                    <i :class="equitItem.equipShow
                      ? 'el-icon-caret-bottom'
                      : 'el-icon-caret-top'
                      "></i>
                    平台{{ idx + 1 }}
                  </span>
                  <el-form-item style="flex: 1; margin: 0" class="only"
                    :prop="`tableList[${index}].equip[${idx}].platform`">
                    <el-cascader :show-all-levels="false" v-model="equitItem.platform" :options="redEquipList"
                      :props="{ expandTrigger: 'hover', emitPath: false }"
                      @change="handleChangeRedPlatform($event, equitItem)"></el-cascader>
                  </el-form-item>
                  <el-button type="text" @click="clickDelEquit(index, idx)">删除</el-button>
                </div>
                <transition name="el-zoom-in-top">
                  <div class="equit-main" v-show="equitItem.equipShow">
                    <!-- <el-form-item
                      label="平台"
                      :prop="`tableList[${index}].equip[${idx}].platform`"
                      :rules="[
                        {
                          required: true,
                          message: '请输入',
                          trigger: 'change',
                        },
                      ]"
                    >
                      <el-cascader
                        :show-all-levels="false"
                        v-model="equitItem.platform"
                        :options="equipList"
                        :props="{ expandTrigger: 'hover', emitPath: false }"
                        @change="handleChangeEquip"
                      ></el-cascader>
                    </el-form-item> -->
                    <div class="equipPerformance">
                      <div class="equit-content platformshow-content" v-for="(i, ids) in equitItem.equipPerformance"
                        :key="ids">
                        <div class="equit-title">
                          <span @click="equitShows(i)">
                            <i :class="i.platformshow
                              ? 'el-icon-caret-bottom'
                              : 'el-icon-caret-top'
                              "></i>
                            装备{{ ids + 1 }}</span>
                          <el-form-item style="flex: 1; margin: 0" class="only"
                            :prop="`tableList[${index}].equip[${idx}].equipPerformance[${ids}].equipName`">
                            <el-select v-model="i.equipName" placeholder="请选择"
                              @change="handleChangeRedEquip($event, equitItem.platform, i)">
                              <el-option v-for="item in equitItem.redEquipmentNameList" :key="item.deviceId" :label="item.equipmentName"
                                :value="item.deviceId" :title="item.equipmentName">
                              </el-option>
                            </el-select>
                          </el-form-item>
                          <el-button type="text" @click="clickDelequipPerformance(index, idx, ids)">删除</el-button>
                        </div>
                        <transition name="el-zoom-in-top">
                          <div class="equit-main" v-show="i.platformshow">
                            <!-- <el-form-item
                              label="装备"
                              :prop="`tableList[${index}].equip[${idx}].equipPerformance[${ids}].equipName`"
                              :rules="[
                                {
                                  required: true,
                                  message: '请输入',
                                  trigger: 'change',
                                },
                              ]"
                            >
                              <el-cascader
                                :show-all-levels="false"
                                v-model="i.equipName"
                                :options="equipList"
                                :props="{
                                  expandTrigger: 'hover',
                                  emitPath: false,
                                }"
                                @change="handleChangeEquip"
                              ></el-cascader>
                            </el-form-item> -->
                            <el-form-item label="能力"
                              :prop="`tableList[${index}].equip[${idx}].equipPerformance[${ids}].capacity`" :rules="[
                                {
                                  required: true,
                                  message: '请输入',
                                  trigger: 'change',
                                },
                              ]">
                              <el-cascader :show-all-levels="false" v-model="i.capacity" :options="capacityList" :props="{
                                expandTrigger: 'hover',
                                emitPath: false,
                              }" @change="handleChange"></el-cascader>
                            </el-form-item>
                            <el-form-item label="性能描述"
                              :prop="`tableList[${index}].equip[${idx}].equipPerformance[${ids}].equipdes`" :rules="[
                                {
                                  required: false,
                                  message: '请输入',
                                  trigger: 'change',
                                },
                              ]">
                              <el-input v-model="i.equipdes" size="small" type="textarea" :rows="5" resize="none">
                              </el-input>
                            </el-form-item>
                            <el-form-item label="应用场景" class="performancedes"
                              :prop="`tableList[${index}].equip[${idx}].equipPerformance[${ids}].performancedes`" :rules="[
                                {
                                  required: true,
                                  message: '请输入',
                                  trigger: 'change',
                                },
                              ]">
                              <el-input v-model="i.performancedes" size="small" type="textarea" :rows="5" resize="none">
                              </el-input>
                            </el-form-item>
                          </div>
                        </transition>
                      </div>
                      <el-button type="primary" size="small"
                        @click="clickAddequipPerformance(index, idx, ids)">添加装备</el-button>
                    </div>
                  </div>
                </transition>
              </div>
              <el-button type="primary" size="small" @click="clickAddEquit(index)">添加平台</el-button>
            </div>
          </transition>
        </div>
      </div>
    </el-form>
    <div class="btn">
      <el-button size="small" @click="goBack">取消</el-button>
      <el-button type="primary" size="small" @click="submitScheme">确定</el-button>
    </div>
  </div>
</template>
<script>
import { getresolvemenu, getequipmentmenu, getblueequipmentmenu, getredequipmentmenu, planSave, taskDetail } from "@/api/project";
import { getEquipDetail, getBlueEquipNameList, getBlueEquipAttrs, getRedEquipAttrs, getRedEquipNameList } from "@/api/equip";
export default {
  data() {
    return {
      formData: {
        schemeName: "",
        blueForm: [
          {
            platform: "",
            equipmentNameList: [],
            equipPerformance: [
              {
                equipName: "",
                capacity: "",
                equipdes: "",
                performancedes: "",
                platformshow: true,
              },
            ],
            equipShow: true,
          },
        ],
        tableList: [
          {
            activity: "",
            activityDes: "",
            equip: [
              {
                platform: "",
                redEquipmentNameList: [],
                equipPerformance: [
                  {
                    equipName: "",
                    capacity: "",
                    equipdes: "",
                    performancedes: "",
                    platformshow: true,
                  },
                ],
                equipShow: true,
              },
            ],
            stepDes: "",
            show: true,
          },
        ],
      },

      activityOptions: [
        {
          value: "5",
          label: "评估",
          des: "作战任务：1.打击效果评估；2.战场态势评估；3.再次打击分析与决策",
        },
        {
          value: "1",
          label: "定位",
          des: "作战任务：1.确定目标位置；2.掌握目标运动规律；3.对目标进行准确识别和查证",
        },
        {
          value: "2",
          label: "跟踪",
          des: "作战任务：1.调整侦察监视优先级；2.生成目标点轨迹，保持航迹连续性；3.按照生命周期，持续更新目标轨迹",
        },
        {
          value: "4",
          label: "打击",
          des: "作战任务：1.分发交战指令；2.启动武器发射；3.监视与管理战场态势；4.实时调整作战任务和打击预案",
        },
        {
          value: "3",
          label: "瞄准",
          des: "作战任务：1.评估目标威胁；2.分析可用资源，进行交战规则制定；3.分析打击约束，生成打击预案；4.计算武器发射点/命中点；5.评估打击损益；6.生成决策质量",
        },
        {
          value: "0",
          label: "发现",
          des: "作战任务：1.情报收集，目标探测；2.传感器信息集成与融合；3.战场态势实时感知与动态更新",
        },
      ],
      option: [
        {
          label: "大于",
          value: "MORE",
        },
        {
          label: "小于",
          value: "LESS",
        },
        {
          label: "范围",
          value: "IN",
        },
      ],
      capacityList: [],
      equipList: [],
      blueEquipList: [],
      blueEquipmentNameList: [],
      redEquipList: [],
      redEquipmentNameList: [],
      bluePlatFormList: [],
      performanceList: [],
      activities: [],
      capacityObject: [
        {
          label: "SENSOR_COOPERATE",
          val: "传感器协同控制能力",
          num: "0",
        },
        {
          label: "ELECTRONIC_COUNTERMEASURE",
          val: "综合电子对抗能力",
          num: "1",
        },
        {
          label: "NETWORKING_APPLY",
          val: "综合组网运用能力",
          num: "2",
        },
        {
          label: "TACTIC_COOPERATE",
          val: "战术行动协同能力",
          num: "3",
        },
        {
          label: "COMMAND_GUIDE",
          val: "指挥引导控制能力",
          num: "4",
        },
        {
          label: "INFORMATION_HANDLE",
          val: "信息处理与分发能力",
          num: "5",
        },
        {
          label: "WEAPON_COOPERATE",
          val: "武器协同控制能力",
          num: "6",
        },
        {
          label: "EQUIPMENT_GUARANTEE",
          val: "装备保障能力",
          num: "7",
        },
        {
          label: "SITUATION_SHARE",
          val: "态势感知共享能力",
          num: "8",
        },
        {
          label: "TIMEBASE_NAVIGATE",
          val: "时间基准与导航定位能力",
          num: "9",
        },
      ],
      equip: [
        {
          label: "指控",
          value: "ALLEGATION",
        },
        {
          label: "平台",
          value: "PLATFORM",
        },
        {
          label: "传感器",
          value: "SENSOR",
        },
        {
          label: "武器",
          value: "WEAPON",
        },
        {
          label: "数据链",
          value: "CHAIN",
        },
      ],

    };
  },
  mounted() {
    this.getData();
    this.getEquip();
    this.getDetail();
  },
  methods: {
    switchActivityType(s) {
      let res = '';
      switch (s) {
        case 'DISCOVERY':
          res = '0';
          break;
        case 'POSITIONING':
          res = '1';
          break;
        case 'TRACKING':
          res = '2';
          break;
        case 'AIMING':
          res = '3';
          break;
        case 'STRIKING':
          res = '4';
          break;
        case 'ESTIMATING':
          res = '5';
          break;
      }
      return res;
    },
    // 添加蓝方
    clickAddBluePlatform() {
      this.formData.blueForm.push({
        platform: "",
        equipPerformance: [
          {
            equipName: "",
            capacity: "",
            equipdes: "",
            platformshow: true,
          },
        ],
        equipShow: true,
      });
    },
    // 删除蓝方
    clickBluePlatformDel(index) {
      this.formData.blueForm.splice(index, 1);
    },
    // 添加蓝方平台装备
    clickAddBlueEquip(index) {
      this.formData.blueForm[index].equipPerformance.push({
        equipName: "",
        capacity: "",
        equipdes: "",
        platformshow: true,
      });
    },
    // 删除蓝方平台装备
    clickDelBlueEquip(index, idx) {
      this.formData.blueForm[index].equipPerformance.splice(idx, 1);
    },
    getData() {
      const taskId = localStorage.getItem("taskId");
      this.capacityList = [];
      getresolvemenu({ taskId: taskId })
        .then((res) => {
          const { code, data } = res?.data;
          if (code == 200) {
            data.forEach((item, i) => {
              this.capacityList.push({
                label: this.tenCapacityType(item.tenCapacityType),
                value: this.tenCapacityTypeVal(item.tenCapacityType),
                children: [],
              });

              if (item.children && item.children.length) {
                item.children.forEach((items, j) => {
                  this.capacityList[i].children.push({
                    label: items.capacityName,
                    value: items.capacityId,
                    children: [],
                  });
                  if (items.children && items.children.length) {
                    items.children.forEach((val) => {
                      this.capacityList[i].children[j].children.push({
                        label: val.capacityName,
                        value: val.capacityId,
                      });
                    });
                  }
                });
              }
            });
          }
        })
        .catch((err) => {
          this.$message.error(err);
        });
    },
    getEquip() {
      this.blueEquipList = [];
      this.equipList = [];
      let data = {
        taskType: 1,
      }
      getredequipmentmenu(data)
        .then((res) => {
          const { code, data } = res?.data;
          if (code == 200) {
            let list = data.filter(item => item.type == 'PLATFORM' || item.type == 'ALLEGATION');
            let a = list[0].children.concat(list[1].children);
            a.forEach((item, i) => {
              this.redEquipList.push({
                label: item.templateName,
                value: item.templateId,
                children: [],
              });
              if (item.children && item.children.length) {
                item.children.forEach((val) => {
                  this.redEquipList[i].children.push({
                    label: val.equipmentName,
                    value: val.equipmentId,
                  });
                });
              } else if (
                item.childTemplates &&
                item.childTemplates.length
              ) {
                item.childTemplates.forEach((val, idx) => {
                  this.redEquipList[i].children.push({
                    label: val.templateName,
                    value: val.templateId,
                    children: [],
                  });
                  if (val.children && val.children.length) {
                    val.children.forEach((element) => {
                      this.redEquipList[i].children[idx].children.push({
                        label: element.equipmentName,
                        value: element.equipmentId,
                      });
                    });
                  }
                });
              }
            });

            // data.forEach((item, i) => {
            //   this.redEquipList.push({
            //     label: this.changeEquip(item.type),
            //     value: item.type,
            //     children: [],
            //   });
            //   if (item.children && item.children.length) {
            //     item.children.forEach((items, j) => {
            //       this.redEquipList[i].children.push({
            //         label: items.templateName,
            //         value: items.templateId,
            //         children: [],
            //       });
            //       if (items.children && items.children.length) {
            //         items.children.forEach((val) => {
            //           this.redEquipList[i].children[j].children.push({
            //             label: val.equipmentName,
            //             value: val.equipmentId,
            //           });
            //         });
            //       } else if (
            //         items.childTemplates &&
            //         items.childTemplates.length
            //       ) {
            //         items.childTemplates.forEach((val, idx) => {
            //           this.redEquipList[i].children[j].children.push({
            //             label: val.templateName,
            //             value: val.templateId,
            //             children: [],
            //           });
            //           if (val.children && val.children.length) {
            //             val.children.forEach((element) => {
            //               this.redEquipList[i].children[j].children[
            //                 idx
            //               ].children.push({
            //                 label: element.equipmentName,
            //                 value: element.equipmentId,
            //               });
            //             });
            //           }
            //         });
            //       } else {
            //         delete this.redEquipList[i].children[j];
            //       }
            //     });
            //   } else {
            //     delete this.redEquipList[i];
            //   }
            // });
          }
        })
        .catch((err) => {
          this.$message.error(err);
        });
      getblueequipmentmenu()
        .then((res) => {
          const { code, data } = res?.data;
          if (code == 200) {
            let list = data.filter(item => item.type == 'PLATFORM');
            list[0].children.forEach((item, i) => {
              this.blueEquipList.push({
                label: item.templateName,
                value: item.templateId,
                children: [],
              });
              if (item.children && item.children.length) {
                item.children.forEach((val) => {
                  this.blueEquipList[i].children.push({
                    label: val.equipmentName,
                    value: val.equipmentId,
                  });
                });
              } else if (
                item.childTemplates &&
                item.childTemplates.length
              ) {
                item.childTemplates.forEach((val, idx) => {
                  this.blueEquipList[i].children.push({
                    label: val.templateName,
                    value: val.templateId,
                    children: [],
                  });
                  if (val.children && val.children.length) {
                    val.children.forEach((element) => {
                      this.blueEquipList[i].children[idx].children.push({
                        label: element.equipmentName,
                        value: element.equipmentId,
                      });
                    });
                  }
                });
              }
            });
            // data.forEach((item, i) => {
            //   this.blueEquipList.push({
            //     label: this.changeEquip(item.type),
            //     value: item.type,
            //     children: [],
            //   });
            //   if (item.children && item.children.length) {
            //     item.children.forEach((items, j) => {
            //       this.blueEquipList[i].children.push({
            //         label: items.templateName,
            //         value: items.templateId,
            //         children: [],
            //       });
            //       if (items.children && items.children.length) {
            //         items.children.forEach((val) => {
            //           this.blueEquipList[i].children[j].children.push({
            //             label: val.equipmentName,
            //             value: val.equipmentId,
            //           });
            //         });
            //       } else if (
            //         items.childTemplates &&
            //         items.childTemplates.length
            //       ) {
            //         items.childTemplates.forEach((val, idx) => {
            //           this.blueEquipList[i].children[j].children.push({
            //             label: val.templateName,
            //             value: val.templateId,
            //             children: [],
            //           });
            //           if (val.children && val.children.length) {
            //             val.children.forEach((element) => {
            //               this.blueEquipList[i].children[j].children[
            //                 idx
            //               ].children.push({
            //                 label: element.equipmentName,
            //                 value: element.equipmentId,
            //               });
            //             });
            //           }
            //         });
            //       } else {
            //         delete this.blueEquipList[i].children[j];
            //       }
            //     });
            //   } else {
            //     delete this.blueEquipList[i];
            //   }
            // });
          }
        })
        .catch((err) => {
          this.$message.error(err);
        });
    },
    getDetail() {
      const taskId = localStorage.getItem("taskId");
      taskDetail({ taskId: taskId }).then((res) => {
        const { code, data } = res?.data;
        if (code == 200) {
          this.dataBacktrack(data);
        }
      });
    },
    dataBacktrack(data) {
      const blueForm = [];
      if (data.bluePlatFormList && data.bluePlatFormList.length) {
        data.bluePlatFormList.forEach((i, ix) => {
          blueForm.push({
            platformNum: ix,
            platform: i.equipmentId,
            equipShow: true,
            equipPerformance: [],
            blueEquipmentNameList: i.equipmentList,
          })
          if (i.platformDeviceList && i.platformDeviceList.length) {
            i.platformDeviceList.forEach((item) => {
              blueForm[ix].equipPerformance.push({
                equipName: item.deviceId,
                capacity: item.capacityId,
                equipdes: item.performanceDesc,
                performancedes: item.applyScene,
                platformshow: true,
              });
            });
          }
        });
      }
      this.formData.blueForm = blueForm;
    },
    handleChange(val) {
      console.log(val);
    },
    changeEquip(val) {
      for (let i = 0; i < this.equip.length; i++) {
        if (this.equip[i].value == val) {
          return this.equip[i].label;
        }
      }
    },
    selectAttribute(val, ids) {
      this.performanceList.forEach((item) => {
        if (item.attributeId == val[ids].val) {
          val[ids].unit = item.unit;
        }
      });
    },
    handleChangeBluePlatform(val) {
      getBlueEquipNameList({ equipmentId: val }).then((res) => {
        const { data } = res?.data;
        this.blueEquipmentNameList = data;
      });
    },
    handleChangeBlueEquip(deviceId, equipmentId, item) {
      getBlueEquipAttrs({ equipmentId: equipmentId, deviceId: deviceId }).then((res) => {
        const { data } = res?.data;
        item.equipdes = data;
      });
    },
    handleChangeRedPlatform(val, equipItem) {
      getRedEquipNameList({ equipmentId: val }).then((res) => {
        const { data } = res?.data;
        equipItem.redEquipmentNameList = data;
        equipItem.equipPerformance.forEach((item, index) => {
          item.equipName = "";
        })
      });
    },
    handleChangeRedEquip(deviceId, equipmentId, item) {
      getRedEquipAttrs({ equipmentId: equipmentId, deviceId: deviceId }).then((res) => {
        const { data } = res?.data;
        item.equipdes = data;
      });
    },
    handleChangeEquip(val) {
      getEquipDetail({ equipmentId: val }).then((res) => {
        const { data } = res?.data;
        this.performanceList = data;
      });
    },
    tenCapacityTypeVal(val) {
      for (let i = 0; i < this.capacityObject.length; i++) {
        if (this.capacityObject[i].label == val) {
          return this.capacityObject[i].num;
        }
      }
    },
    tenCapacityType(val) {
      for (let i = 0; i < this.capacityObject.length; i++) {
        if (this.capacityObject[i].label == val) {
          return this.capacityObject[i].val;
        }
      }
    },
    changeSelect(event) {
      for (var i = 0, len = this.activityOptions.length; i < len; i++) {
        if (this.activityOptions[i].value == event.activity) {
          event.activityDes = this.activityOptions[i].des;
          break;
        }
      }
    },
    addStep() {
      this.formData.tableList.push({
        activity: "",
        activityDes: "",
        equip: [
          {
            platform: "",
            redEquipmentNameList: [],
            equipPerformance: [
              {
                equipName: "",
                capacity: "",
                equipdes: "",
                performancedes: "",
                platformshow: true,
              },
            ],
            equipShow: true,
          },
        ],
        stepDes: "",
        show: true,
      });
    },

    cancelEquitStep(index) {
      this.formData.tableList.splice(index, 1);
    },

    changEquitShow(index, item) {
      item.show = !item.show;
    },
    equitShow(equitItem) {
      equitItem.equipShow = !equitItem.equipShow;
    },
    equitShows(i) {
      i.platformshow = !i.platformshow;
    },
    clickDelEquit(index, idx) {
      this.formData.tableList[index].equip.splice(idx, 1);
    },
    clickAddEquit(index) {
      this.formData.tableList[index].equip.push(
        {
          platform: "",
          redEquipmentNameList: [],
          equipPerformance: [
            {
              equipName: "",
              capacity: "",
              equipdes: "",
              performancedes: "",
              platformshow: true,
            },
          ],
          equipShow: true,
        },
      );
    },
    clickAddequipPerformance(index, idx) {
      this.formData.tableList[index].equip[idx].equipPerformance.push(
        {
          equipName: "",
          capacity: "",
          equipdes: "",
          performancedes: "",
          platformshow: true,
        },
      );
    },
    clickDelequipPerformance(index, idx, i) {
      this.formData.tableList[index].equip[idx].equipPerformance.splice(i, 1);
    },
    submitScheme() {
      this.bluePlatFormList = [];
      this.activities = [];
      if (this.formData.blueForm && this.formData.blueForm.length) {
        this.formData.blueForm.forEach((i, ix) => {
          this.bluePlatFormList.push({
            platformNum: ix,
            equipmentId: i.platform,
            platformDeviceList: [],
          })
          if (i.equipPerformance && i.equipPerformance.length) {
            i.equipPerformance.forEach((item) => {
              this.bluePlatFormList[
                ix
              ].platformDeviceList.push({
                equipmentId: i.platform,
                deviceName: item.equipName,
                deviceId: item.equipName,
                capacityId: item.capacity,
                performanceDesc: item.equipdes,
                applyScene: item.performancedes
              });
            });
          }
        });
      }
      if (this.formData.tableList && this.formData.tableList.length) {
        this.formData.tableList.forEach((i, ix) => {
          this.activities.push({
            activityNum: ix,
            activityType: i.activity,
            stepDes: i.stepDes,
            activityDes: i.activityDes,
            platFormList: [],
          });
          if (i.equip && i.equip.length) {
            i.equip.forEach((j, jx) => {
              this.activities[ix].platFormList.push({
                platformNum: jx,
                equipmentId: j.platform,
                platformDeviceList: [],
              });
              if (j.equipPerformance && j.equipPerformance.length) {
                j.equipPerformance.forEach((item) => {
                  this.activities[ix].platFormList[
                    jx
                  ].platformDeviceList.push({
                    equipmentId: j.platform,
                    deviceName: item.equipName,
                    deviceId: item.equipName,
                    capacityId: item.capacity,
                    performanceDesc: item.equipdes,
                    applyScene: item.performancedes
                  });
                });
              }
            });
          }
        });

      }
      if (this.activities.length > 0 || this.bluePlatFormList.length > 0) {
        const data = {
          planName: this.formData.schemeName,
          taskId: localStorage.getItem("taskId"),
          isRecommend: "否",
          activities: this.activities,
          bluePlatFormList: this.bluePlatFormList,
        };
        this.$refs.form.validate((valid) => {
          if (valid) {
            planSave(data)
              .then((res) => {
                const { code, msg } = res?.data;
                if (code == 200) {
                  this.goBack();
                  this.$message.success(msg);
                } else {
                  this.$message.error(msg);
                }

              })
              .catch((err) => {
                this.$message.error(err);
              });
          }
        });
      }
    },
    attrValues(item) {
      switch (item.price) {
        case "LESS":
          return [item.num];
        case "MORE":
          return [item.num];
        case "IN":
          return [item.start, item.end];
        default:
          return [];
      }
    },
    relation(item) {
      switch (item) {
        case "LESS":
          return 0;
        case "MORE":
          return 1;
        case "IN":
          return 2;
        default:
          return 0;
      }
    },
    goBack() {
      this.$router.push("/app/projectDetail/SchemeDesign");
    },
  },
};
</script>
<style lang="scss" scoped>
:deep(.el-input) {
  width: 320px;
}

.form-content {
  height: calc(100vh - 233px);
  overflow: auto;
  margin-top: 16px;
  padding-bottom: 24px;
}

.btn {
  padding-top: 16px;
  border-radius: 4px;
  border-top: 1px solid #bdbdbd;
  text-align: right;
}

.table-title,
.equit-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.equit-title {
  margin-bottom: 15px;
}

.table-item {
  background: #e4e7ed;
  padding: 24px;
  border-radius: 4px;
  margin: 8px 0 16px 0px;
}

.equit-content {
  background: #c0c4cc;
  padding: 16px;
  border-radius: 4px;
  margin-bottom: 8px;
}

.equipPerformance {
  background: #dcdfe6;
  padding: 16px;
  border-radius: 4px;
  margin-bottom: 24px;
}

.select {
  margin: 0 16px;

  :deep(.el-input) {
    width: 120px;
  }
}

.ipt {
  width: 120px;
}

:deep(.el-textarea) {
  width: 320px;
}

.equit-main {
  position: relative;
}

.performancedes {
  position: absolute;
  top: -56px;
  left: 424px;
}
</style>
<style lang="scss">
.only {
  .el-form-item__content {
    margin-left: 28px !important;
  }
}

.platformshow-content {
  background: #e4e7ed !important;
}
</style>
